<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
    <title>Reglas</title>
    <link href="/EmergenciasWAR/public/css/bootstrap.min.css" rel='stylesheet' type='text/css' />
    <link href="/EmergenciasWAR/public/css/bootstrap-select.min.css" rel='stylesheet' type='text/css' />        

    <script src="/EmergenciasWAR/public/js/jquery/jquery.min.js" charset="UTF-8" type="text/javascript"></script>    
    <script src="/EmergenciasWAR/public/js/bootstrap/bootstrap.min.js" charset="UTF-8" type="text/javascript"></script>
    <script src="/EmergenciasWAR/public/js/bootstrap/bootstrapValidator.min.js" charset="UTF-8" type="text/javascript"></script>
    <script src="/EmergenciasWAR/public/js/bootstrap/bootstrap-select.min.js" charset="UTF-8" type="text/javascript"></script>
    <script src="/EmergenciasWAR/public/js/bootstrap/bootbox.min.js" charset="UTF-8" type="text/javascript"></script>
    <script src="/EmergenciasWAR/public/js/admin/regla_paciente.js" charset="UTF-8" type="text/javascript"></script>

</head>
<body>
    <jsp:include page="menu_barra.jsp"/>
    <div class="container">
        <div class="row" style="margin-top: 50px;">
            <table class="table table-striped table-condensed"><tr><th><h4 class="text-info" align="center"><i class="glyphicon glyphicon-plus"></i> Agregar Regla</h4></th></tr></table>
            <div class="col-md-6 col-md-offset-3" style="margin-bottom: 30px">
                <input type="hidden" value="${it.idDiagnosticoPaciente}" id="idDiagnosticoPaciente" name="diagnosticoPaciente"></input>
                <form id="agregarForm" role="form" class="form-inline">
                    <div class="row">
                        <div class="form-group  col-xs-10">
                            <label class="control-label col-sm-3" for="inputHoraInicio">Hora Inicio:</label>
                            <div class="col-sm-6">
                                <select class="selectpicker" id="inputHoraInicio" name="horaInicio" title="Seleccione Hora" data-width="100%">
                                    <option id="hi1">00:00</option>
                                    <option id="hi2">01:00</option>
                                    <option id="hi3">02:00</option>
                                    <option id="hi4">03:00</option>
                                    <option id="hi5">04:00</option>
                                    <option id="hi6">05:00</option>
                                    <option id="hi7">06:00</option>
                                    <option id="hi8">07:00</option>
                                    <option id="hi9">08:00</option>
                                    <option id="hi10">09:00</option>
                                    <option id="hi11">10:00</option>
                                    <option id="hi12">11:00</option>
                                    <option id="hi13">12:00</option>
                                    <option id="hi14">13:00</option>
                                    <option id="hi15">14:00</option>
                                    <option id="hi16">15:00</option>
                                    <option id="hi17">16:00</option>
                                    <option id="hi18">17:00</option>
                                    <option id="hi19">18:00</option>
                                    <option id="hi20">19:00</option>
                                    <option id="hi21">20:00</option>
                                    <option id="hi22">21:00</option>
                                    <option id="hi23">22:00</option>
                                    <option id="hi24">23:00</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    </br>
                    <div class="row">
                        <div class="form-group col-xs-10">
                            <label class="control-label col-sm-3" for="inputHoraFin">Hora F&iacute;n:</label>
                            <div class="col-sm-6">
                                <select class="selectpicker" id="inputHoraFin" name="horaFin" title="Seleccione Hora" data-width="100%">
                                    <option id="hf1">00:00</option>
                                    <option id="hf2">01:00</option>
                                    <option id="hf3">02:00</option>
                                    <option id="hf4">03:00</option>
                                    <option id="hf5">04:00</option>
                                    <option id="hf6">05:00</option>
                                    <option id="hf7">06:00</option>
                                    <option id="hf8">07:00</option>
                                    <option id="hf9">08:00</option>
                                    <option id="hf10">09:00</option>
                                    <option id="hf11">10:00</option>
                                    <option id="hf12">11:00</option>
                                    <option id="hf13">12:00</option>
                                    <option id="hf14">13:00</option>
                                    <option id="hf15">14:00</option>
                                    <option id="hf16">15:00</option>
                                    <option id="hf17">16:00</option>
                                    <option id="hf18">17:00</option>
                                    <option id="hf19">18:00</option>
                                    <option id="hf20">19:00</option>
                                    <option id="hf21">20:00</option>
                                    <option id="hf22">21:00</option>
                                    <option id="hf23">22:00</option>
                                    <option id="hf24">23:00</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    </br>

                    <div class="row">
                        <div class="form-group col-xs-3">
                            <input type="text" id="inputValor1" class="form-control" name="valor1" placeholder="valor 1"/>                            
                        </div>

                        <div class="form-group col-xs-3">                            
                            <select class="selectpicker" id="inputSigno1" name="signo1" title="signo 1" data-width="100%">
                                <c:forEach var="item" items="${it.signos}">
                                    <option value="${item.idSignoComparacion}" data-subtext="${item.valor}">${item.descripcion}</option>
                                </c:forEach>
                            </select>                                                        
                        </div>                                                                                                            
                    </div>                    
                    <div class="row">
                        <div style="margin: 0 auto;width: 55%;">
                            AND
                        </div>                        
                    </div>
                    <div class="row">
                        <div class="form-group col-xs-3">
                            <input type="text" id="inputValor2" class="form-control" name="valor2" placeholder="valor 2"/>
                        </div>

                        <div class="form-group col-xs-3">                            
                            <select class="selectpicker" id="inputSigno2" name="signo2" title="signo 2" data-width="100%">
                                <c:forEach var="item" items="${it.signos}">
                                    <option value="${item.idSignoComparacion}" data-subtext="${item.valor}">${item.descripcion}</option>
                                </c:forEach>
                            </select>
                        </div>
                    </div>

                    </br>
                    <div class="row">
                        <div class="col-lg-4"></div>
                        <div class="controls col-lg-8">
                            <button type="button" class="btn btn-danger" id="buttonAgregar" ><i class="glyphicon glyphicon-floppy-saved"></i> Agregar</button>
                        </div>
                    </div>
                </form>
                </br>
                <div class="table-responsive">
                    <table class="table table-striped table-condensed"><tr><th><h4 class="text-info" align="center"><i class="glyphicon glyphicon-plus-sign"></i> Reglas por rango de d&iacute;a</h4></th></tr></table>
                    <table id="idReglaPaciente" class="table table-striped table-hover">
                        <thead>
                            <tr class='warning'>                                    
                                <th class="col-md-3">Hora Inicio</th>
                                <th class="col-md-3">Hora Fin</th>
                                <th class="col-md-6">Regla</th>
                                <th class="col-md-2"></th>
                            </tr>
                        </thead>
                        <tbody>

                        </tbody>
                    </table>
                </div>

                <div class="row">
                    <div class="col-lg-4"></div>
                    <div class="controls col-lg-8">
                        <button type="button" class="btn btn-primary" id="buttonGuardar" ><i class="glyphicon glyphicon-floppy-saved"></i> Guardar</button>
                    </div>
                </div>
            </div>
        </div>
    </div>                     
</body>